﻿@model Apps.Models.Flow.FlowStateCountModel
@using Apps.Web.Core;
@using Apps.Common;
@using Apps.Models.Sys;
@using Apps.Locale;
@using Apps.Models.Enum;
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Index_Layout.cshtml";
    List<permModel> perm = null;
}
 <style type="text/css">
    .datagrid-btable .datagrid-cell { 
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
</style>
<div class="mvctool bgb" style="width:100%">
    <table style="width:100%">
        <tr>
            <td>
                <input id="txtQuery" type="text" placeholder="标题" style="width:160px;" /> 
                @Html.ToolButton("btnQuery", "fa fa-search", Resource.Query, ref perm, "Query", true)
                @Html.ToolButton("btnDetails", "fa fa-list", Resource.Details, ref perm, "Query", true)
            </td>
            <td style="line-height:30px; text-align:right;padding-right:30px;   ">
                <span class='color-black ml10 fa fa-circle' onclick="QueryFlow('0')">我的申请（@Model.requestCount）</span>
                <span class='color-blue ml10 fa fa-circle' onclick="QueryFlow('1')"> 审批中（@Model.processCount）</span>
                <span class='color-green ml10 fa fa-circle' onclick="QueryFlow('2')"> 审批通过（@Model.passCount）</span>
                <span class='color-red ml10 fa fa-circle' onclick="QueryFlow('3')"> 驳回（@Model.rejectCount）</span>
                @*<span class='color-gray ml10 fa fa-circle' onclick="QueryFlow('4')"> 过期（@Model.closedCount）</span>*@
            </td>
        </tr>
    </table>
</div>
<table style="width:100%" class="formtable">
    <tbody>
        <tr>
            <td>
                <div class="easyui-panel" style="padding:2px;width:100%">
                    <table id="List" style="width:100%"></table>
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div class="hr"></div>
                <div title="流程明细" class="easyui-panel" style="padding:2px;width:100%">
                    <table id="flowsteplist" style="width:100%"></table>
                </div>
            </td>
        </tr>
    </tbody>
</table>


<div id="modalwindow" class="easyui-window" data-options="modal:true,closed:true,minimizable:false,shadow:false"></div>
@Html.Partial("~/Views/Shared/_Partial_AutoGrid.cshtml")
<script type="text/javascript">
    var currow;
    function formatterFlowState(value)
    {
        var ret = "";
        switch(value)
        {
            case @((int)FlowStateEnum.Pass):
                ret = "<span class='label label-green'>已通过</span>";
                break;
            case @((int)FlowStateEnum.Progress):
                ret = "<span class='label label-blue'>进行中</span>";
                break;
            case @((int)FlowStateEnum.Reject):
                ret = "<span class='label label-red'>被驳回</span>";
                break;
            default:
                ret = "<span class='label label-gray'>已过期</span>";
                break;
        }
        return ret;
    }

    $(function () {
        function FlowSTEPNOFormatter(value) {
            var stepname = "";
            if (value == 0) {
                stepname = "起草";
            }
            else {
                stepname = "第" + value + "步";
            }
            return stepname;
        }

        $('#flowsteplist').datagrid({
            url: '/Flow/Form/GetFlowStepInfoList?id=',
            toolbar: '#DetailListTools',
            //width: SetGridWidthSub(40),
            methord: 'post',
            height: 200,
            fitColumns: true,
            sortName: 'STEPNO',
            sortOrder: 'asc',
            idField: 'ID',
            pageSize: 15,
            pageList: [15, 20, 30, 40, 50],
            pagination: true,
            striped: true, //奇偶行是否区分
            singleSelect: true,//单选模式
            columns: [[
                { field: 'STEPNO', title: '序号', width: 40, sortable: true, formatter: function (value, row) { return FlowSTEPNOFormatter(value) } },
                    { field: 'TITLE', title: '流程名称', width: 100, sortable: true },
                    { field: 'STEPNAME', title: '环节名称', width: 120, sortable: true },
                    { field: 'FORMLEVEL', title: '紧急程度', width: 80, sortable: true, hidden: true },
                    { field: 'CREATETIME', title: '流程开始时间', width: 80, sortable: true, hidden: true },
                    { field: 'TIMEOUT', title: '流程结束时间', width: 80, sortable: true, hidden: true },
                    { field: 'STARTUSERNAME', title: '起草人', width: 80, sortable: true, hidden: true },
                    { field: 'STEPSTATE', title: '环节状态', width: 50, sortable: true },
                    { field: 'TASKFINISHDATE', title: '下达时间', width: 90, sortable: true },
                    { field: 'USERNAME', title: '作业员', width: 60, sortable: true },
                    { field: 'CHECKTYPE', title: '处理方式', width: 50, sortable: true },
                    { field: 'REAMRK', title: '处理意见', width: 80, sortable: true },
                    { field: 'CHECKSTATE', title: '处理状态', width: 50, sortable: true },
                    //{ field: 'TASKFINISHDATE', title: '处理时间', width: 40, sortable: true, hidden: true },
                    { field: 'STEPCHECKID', title: 'STEPCHECKID', width: 80, sortable: true, hidden: true },
                    { field: 'STATEFLAG', title: 'STATEFLAG', width: 80, sortable: true, hidden: true },
                    { field: 'STARTUSERID', title: 'STARTUSERID', width: 80, sortable: true, hidden: true },
                    { field: 'ID', title: 'ID', width: 80, sortable: true, hidden: true },
                    { field: 'FORMID', title: 'FORMID', width: 80, sortable: true, hidden: true },
                    { field: 'USERID', title: 'USERID', width: 80, sortable: true, hidden: true },
                    { field: 'ATTRZ', title: 'ATTRZ', width: 80, sortable: true, hidden: true }
            ]],
            onLoadSuccess: function (data) { 
            }
        });

        $('#List').datagrid({
            url: '@Url.Action("GetListByUserId")',
            //width:SetGridWidthSub(10),
            methord: 'post',
            height:  SetGridHeightSub(290),
            fitColumns: true,
            sortName: 'CREATETIME',
            sortOrder: 'desc',
            idField: 'ID',
            pageSize: 15,
            pageList: [15, 20, 30, 40, 50],
            pagination: true,
            striped: true, //奇偶行是否区分
            singleSelect: true,//单选模式
            rownumbers: true,//行号
            onLoadSuccess: function (data) {
                //默认选中第一行
                var rows = $('#List').datagrid('getRows');
                if (rows != null && rows.length > 0) {
                    currow = rows[0];
                    $('#List').datagrid('selectRow', 0);
                    $('#flowsteplist').datagrid("load", { id: currow.Id });
                }
            },
            columns: [[
                { field: 'Id', title: 'ID', width: 80,hidden:true },
                { field: 'Title', title: '标题', width: 180,sortable:true ,formatter: 
                 function (value,row) 
                 { 
                     if(row.AttrZ == null || row.AttrZ == "")
                     {
                         return value ;
                     }
                     return value + "("+ row.AttrZ +")";
                 }
                },
                { field: 'UserId', title: '发起用户', width: 80, sortable: true, hidden: true },
                { field: 'FormId', title: '对应表单', width: 80, sortable: true, hidden: true },
                { field: 'FormLevel', title: '公文级别', width: 80,sortable:true, hidden: true  },
                { field: 'CreateTime', title: '创建时间', width: 110,sortable:true },
                { field: 'TimeOut', title: '截至时间', width: 80, sortable: true, hidden: true, formatter: function (value) { return SubStrYMD(value) } },
                { field: 'CurrentStep', title: '当前环节', width: 180, sortable: true, align: 'center' },
                { field: 'CurrentState', title: '当前状态', width: 80, sortable: true, align: 'center',formatter: formatterFlowState  },
                //{ field: 'Action', title: '操作', width: 80, sortable: true, align: 'center',formatter:function(value,row,index){
                //    return "<a href='#' title='管理'  onclick='ManageFlow(\"" + row.Title + "\",\"" + row.FormId + "\",\"" + row.Id + "\",\"" + row.IsExternal + "\")'>管理</a> | <a href='#' title='图例'  onclick='LookFlow(\"" + row.FormId + "\",\"" + row.Id + "\")'>图例</a>";
                //}}
            ]]
             ,
            onClickRow: function (index, row) {
                if (row != null) {
                    currow = row;
                    $('#flowsteplist').datagrid("load", { id: row.Id });
                }
            }
        });
    });
    //ifram 返回
    function frameReturnByClose() {
        $("#modalwindow").window('close');
    }
    function frameReturnByReload(flag) {
        if (flag)
            $("#List").datagrid('load');
        else
            $("#List").datagrid('reload');
    }
    function frameReturnByMes(mes) {
        $.messageBox5s(Lang.Tip, mes);
    }
    function LookFlow(formId,contentId)
    {
        $("#modalwindow").html("<iframe width='100%' height='100%' scrolling='auto' frameborder='0' src='@Url.Action("Details")?id=" + formId + "&contentId="+contentId+"&Ieguid=" + GetGuid() + "'></iframe>");
                $("#modalwindow").window({ title: '图例', width: 500, height: 380, iconCls: 'fa fa-list' }).window('open');
    }
    function ManageFlow(winTitle, formId, id,IsExternal)
    {
       var url = "@Url.Action("Edit")?formId=" + formId + "&id=" + id + "&Ieguid=" + GetGuid() + "";
       if(IsExternal=="true")
       {
           url = "@Url.Action("EditExternal")?formId=" + formId + "&id=" + id + "&Ieguid=" + GetGuid() + "";
       }

        $("#modalwindow").html("<iframe width='100%' height='100%' scrolling='auto' frameborder='0'' src='"+url+"'></iframe>");
        $("#modalwindow").window({ title: winTitle, width:  SetGridWidthSub(10), height: SetGridHeightSub(10), iconCls: 'fa fa-file-text-o' }).window('open');
    }

    function QueryFlow(statetype)
    {
        $("#List").datagrid("load", {
            queryStr: $("#txtQuery").val() ,
            statetype:statetype
        });
    }

    $(function () {
        $("#btnDetails").click(function () {
            if (currow != null) {
                FlowDetail(currow.Title, currow.Id, currow.FormId, SetGridWidthSub(20), SetGridHeightSub(40));
            } else { $.messageBox5s(Lang.Tip, '@Resource.PlaseChooseToOperatingRecords'); }
        });

        $("#btnQuery").click(function () {
            $("#List").datagrid("load", {
                queryStr: $("#txtQuery").val() 
            });
        }); 
    });
</script>
